// axios配置
import { Loading } from 'element-ui'
import axios from 'axios'
import router from '@/router/index.js'

// axios.post()
// create(配置) return 配置完毕的axios (这个axios和之前的axios用法一样)
const instance = axios.create({
  baseURL: 'http://www.liulongbin.top:3008'
})

// 控制全屏加载动画显隐的数据 (对象).close()
let fullscreenLoading

// 添加请求拦截器
instance.interceptors.request.use(
  function (config) {
    // 在发送请求之前做些什么

    // 统一设置token
    // console.log(config)
    // 如果请求url是以 /my开头 => 设置headers
    if (config.url.startsWith('/my')) {
      config.headers.Authorization = window.localStorage.getItem('token')
    }

    // console.log('--request发送之前--') // loading动画转
    fullscreenLoading = Loading.service({
      text: '玩命加载中',
      spinner: 'el-icon-loading',
      background: 'rgba(0, 0, 0, 0.7)'
    })
    return config
  },
  function (error) {
    // 对请求错误做些什么
    return Promise.reject(error)
  }
)

// 添加响应拦截器
instance.interceptors.response.use(
  function (response) {
    // 对响应数据做点什么
    // console.log('--res返回之前--')
    fullscreenLoading.close()
    return response
  },
  function (error) {
    // 401
    if (error.response.status === 401) {
      // 移除无效的token
      window.localStorage.removeItem('token')
      // 跳转到login
      // /a => /b => 一一匹配 => 显示组件
      // this => VueComponent
      // this.$router.push('/login')
      // => $router =>  const router =new VueRouter()
      // this.$router.push('/login')
      // 方式1
      router.push('/login')
      // 方式2
      // window.location.href = '/login'
      // => /xxx => /login => 一一匹配路由 => 显示组件
    }
    fullscreenLoading.close()
    // 对响应错误做点什么
    return Promise.reject(error)
  }
)
export default instance
